<template>
  <div class="margin-container-list">
    <!-- 操作区域 -->
    <div class="tab-style-default">
      <el-tabs v-model="activeStatus" @tab-click="handleClickStatus">
        <el-tab-pane label="我的微客" name="1"></el-tab-pane>
        <el-tab-pane label="小黑屋" name="2"></el-tab-pane>
      </el-tabs>
    </div>
    <div class="radius-container mar-l-0 mar-t-10 mar-r-0 pad-l-10 pad-r-10 pad-t-15 pad-b-15">
      <el-tabs v-model="activeName" type="card" class="tab-style-1" @tab-click="handleClick">
        <el-tab-pane label="方案一" name="0"></el-tab-pane>
        <el-tab-pane label="方案二" name="1"></el-tab-pane>
        <el-tab-pane label="方案三" name="2"></el-tab-pane>
      </el-tabs>    
      <div class="div-style-2 font-16 mar-t-0" v-if="activeStatus === '1'">
        <template v-if="activeName === '0'">
          <p class="font-18"><b>分享添加流程说明</b></p>
          <p>第一步：复制下方签约系统链接和您的企业签约编码分享给您合作的微客；</p>
          <div style="padding-left: 85px" class="flex v-align-c pad-t-2 pad-b-2">
            <div class="flex-item"><b>签约系统：</b> <span class="blue">https://sign.joinsun.vip?v=1</span></div>
            <button type="button" class="el-button el-button--default el-button--mini copy-bar"
              data-clipboard-text="https://sign.joinsun.vip?v=1" @click="doCopy">
              <span>复制</span>
            </button>
          </div>
          <div style="padding-left: 85px" class="flex v-align-c pad-t-2 pad-b-2">
            <div class="flex-item"><b>企业签约编码：</b> <span class="blue">{{ signCode }}</span></div>
            <el-button size="mini" type="primary" plain @click="resetSignCode">重置</el-button>
            <button type="button" class="el-button el-button--default el-button--mini copy-bar"
              :data-clipboard-text="signCode" @click="doCopy">
              <span>复制</span>
            </button>
          </div>
          <p>第二步：微客打开签约系统，填入<span class="blue">手机号</span>和<span class="blue">企业签约编码</span>  →  获取手机验证码  →  实名认证+完善银行卡+签约协议;</p>
          <p>第三步：系统自动效验后  →  后台系统消息提示微客签约成功</p>
          <div class="flex v-align-c pad-t-2 pad-b-2">
            <div class="flex-item">温馨提示：如有疑问可联系客服，电话<span class="blue">18650105811</span></div>
            <button type="button" class="el-button el-button--default el-button--mini copy-bar"
              data-clipboard-text="13328407525" @click="doCopy">
              <span>复制</span>
            </button>
          </div>
        </template>
        <template v-if="activeName === '1'">
          <p class="font-18"><b>批量导入流程说明</b></p>
          <p>第一步：点击<span class="blue">下载模板</span>按钮，下载Excel表格按照表格内容填入微客信息;</p>
          <p>第二步：点击<span class="blue">批量导入</span>按钮，导入微客基本信息;</p>
          <p>第三步：复制下方签约系统链接和您的企业签约编码分享给您合作的微客；</p>
          <div style="padding-left: 85px" class="flex v-align-c pad-t-2 pad-b-2">
            <div class="flex-item"><b>签约系统：</b> <span class="blue">https://sign.joinsun.vip?v=1</span></div>
            <button type="button" class="el-button el-button--default el-button--mini copy-bar"
              data-clipboard-text="https://sign.joinsun.vip?v=1" @click="doCopy">
              <span>复制</span>
            </button>
          </div>
          <div style="padding-left: 85px" class="flex v-align-c pad-t-2 pad-b-2">
            <div class="flex-item"><b>企业签约编码：</b> <span class="blue">{{ signCode }}</span></div>
            <el-button size="mini" type="primary" plain @click="resetSignCode">重置</el-button>
            <button type="button" class="el-button el-button--default el-button--mini copy-bar"
              :data-clipboard-text="signCode" @click="doCopy">
              <span>复制</span>
            </button>
          </div>
          <p>第四步：微客打开签约系统，填入<span class="blue">手机号</span>和<span class="blue">企业签约编码</span>  →  获取手机验证码  →  确认实名认证信息+确认银行卡信息+签约协议;</p>
          <p>第五步：系统自动效验后  →  后台系统消息提示微客签约成功</p>
          <div class="flex v-align-c pad-t-2 pad-b-2">
            <div class="flex-item">温馨提示：如有疑问可联系客服，电话<span class="blue">18650105811</span></div>
            <button type="button" class="el-button el-button--default el-button--mini copy-bar"
              data-clipboard-text="13328407525" @click="doCopy">
              <span>复制</span>
            </button>
          </div>
        </template>
        <template v-if="activeName === '2'">
          <p class="font-18"><b>手动添加流程说明</b></p>
          <p>第一步：点击<span class="blue">新增微客</span>按钮，在线填入微客信息;</p>
          <p>第二步：复制下方签约系统链接和您的企业编码分享给您合作的微客;</p>
          <div style="padding-left: 85px" class="flex v-align-c pad-t-2 pad-b-2">
            <div class="flex-item"><b>签约系统：</b> <span class="blue">https://sign.joinsun.vip?v=1</span></div>
            <button type="button" class="el-button el-button--default el-button--mini copy-bar"
              data-clipboard-text="https://sign.joinsun.vip?v=1" @click="doCopy">
              <span>复制</span>
            </button>
          </div>
          <div style="padding-left: 85px" class="flex v-align-c pad-t-2 pad-b-2">
            <div class="flex-item"><b>企业签约编码：</b> <span class="blue">{{ signCode }}</span></div>
            <el-button size="mini" type="primary" plain @click="resetSignCode">重置</el-button>
            <button type="button" class="el-button el-button--default el-button--mini copy-bar"
              :data-clipboard-text="signCode" @click="doCopy">
              <span>复制</span>
            </button>
          </div>
          <p>第三步：微客打开签约系统，填入<span class="blue">手机号</span>和<span class="blue">企业签约编码</span>  →  获取手机验证码  →  确认实名认证信息+确认银行卡信息+签约协议;</p>
          <p>第四步：系统自动效验后  →  后台系统消息提示微客签约成功</p>
          <div class="flex v-align-c pad-t-2 pad-b-2">
            <div class="flex-item">温馨提示：如有疑问可联系客服，电话<span class="blue">18650105811</span></div>
            <button type="button" class="el-button el-button--default el-button--mini copy-bar"
              data-clipboard-text="13328407525" @click="doCopy">
              <span>复制</span>
            </button>
          </div>
        </template>
      </div>
    </div>

    <!--小黑屋-->
    <div v-if="activeStatus === '2'">
      <div class="tips-con-box font-16">
        <h3 class="font-16">规则说明：</h3>
        <p>1、分享添加、批量导入、手动添加的微客在小黑屋中，则为无效导入。</p>
        <p>2、在小黑屋中的微客，将无法获得酬金。</p>
      </div>
    </div>
    <div class="top-operate">
      <div>
        <el-input @keyup.enter.native="handleSearch" v-model="memberListQuery.keyword" placeholder="请输入昵称/真实姓名/手机号/银行卡号/身份证号"
                  style="width: 300px"></el-input>
        <el-select v-model="memberListQuery.gender" placeholder="请选择" style="width: 80px">
          <el-option
            v-for="item in genders"
            :key="item.value"
            :label="item.label"
            :value="item.value">
          </el-option>
        </el-select>
        <el-select v-model="memberListQuery.signStatusFlag" placeholder="签约状态" style="width: 120px">
          <el-option
            v-for="item in signStatusFlags"
            :key="item.value"
            :label="item.label"
            :value="item.value">
          </el-option>
        </el-select>
        <el-select v-model="memberListQuery.bankId" placeholder="请选择">
          <el-option
            v-for="item in banks"
            :key="item.bankId"
            :label="item.bankName"
            :value="item.bankId">
          </el-option>
        </el-select>
        <el-date-picker
          v-model="starEndTime"
          type="daterange"
          unlink-panels
          range-separator="至"
          start-placeholder="注册开始日期"
          end-placeholder="注册结束日期">
        </el-date-picker>
        <el-button type="primary" @click="handleSearch">查询</el-button>
      </div>
    </div>
    <!-- 内容列表 -->
    <div class="pad-b-20">
      <div class="flex v-align-c" v-if="activeStatus === '1'">
        <el-button @click="handleCreate" class="mar-r-10" type="primary">新增微客</el-button>
        <div class="video-btn mar-r-10">
          <el-upload class="primary-btn plant upload-s-style"
                     action="/api/user/member/uploadMemberExcel"
                     accept="image/mp3"
                     list-type="picture-card-s"
                     :before-upload="beforeUploadFile" name="files"
                     v-loading="fileLoading"
                     :data="token" :show-file-list="false" :on-success="handleUploadSuccessFile">
            <i class="on-btn">批量导入</i>
          </el-upload>
        </div>
        <el-button @click="initTemplateDownload" >下载模板</el-button>
        <el-button @click="bacthOperation(2)" type="danger" plain>批量禁用</el-button>
      </div>
      <template v-if="activeStatus === '2'">
        <el-button @click="bacthOperation(1)" type="primary" plain>批量启用</el-button><br/>
      </template>
    </div>
    <div class="table-container">
      <el-table :data="memberList" @sort-change="sortChange" @selection-change="handleSelectionChange"
                v-loading="listLoading" element-loading-text="加载中"
                style="width: 100%">
        <el-table-column width="55px" type="selection" ></el-table-column>
        <el-table-column width="240px" label="微客" prop="userInfo">
          <template slot-scope="scope">
            <div class="flex v-align-c cursor-p">
              <label><img :src="scope.row.avatar" class="user-avatar" v-if="scope.row.avatar"></label>
              <div class="font-14 pad-l-10">
                <div>昵称：{{scope.row.nickname}}</div>
                <div>姓名：{{scope.row.realName}}</div>
              </div>
            </div>
          </template>
        </el-table-column>
        <el-table-column width="240px" label="性别" prop="nature" >
          <template slot-scope="scope">
            <span v-if="scope.row.gender === 1">男</span>
            <span v-if="scope.row.gender === 2">女</span>
          </template>
        </el-table-column>

        <el-table-column width="240px" label="手机号" prop="phone">
        </el-table-column>
        <el-table-column width="240px" label="身份证" prop="cardNo">
        </el-table-column>
        <el-table-column width="240px" label="开户行名称">
          <template slot-scope="scope">
            {{ bankObj[scope.row.bankId]}}
          </template>
        </el-table-column>
        <el-table-column width="240px" label="银行账号" prop="bankCardNo">
        </el-table-column>
        <el-table-column width="240px" label="签约状态" prop="signStatusFlag">
          <template slot-scope="scope">
            <span v-if="scope.row.signStatusFlag === 0">
              未签约
            </span>
            <span v-if="scope.row.signStatusFlag === 1">已签约</span>
          </template>
        </el-table-column>
        <el-table-column width="140px" label="操作" align="right" fixed="right">
          <template slot-scope="scope">
            <el-button type="text" size="medium" @click="handleUpdate(scope.row)" v-if="scope.row.signStatusFlag === 0">编辑</el-button>
            <el-button type="text" size="medium" @click="handleUpdate(scope.row)" v-if="scope.row.signStatusFlag === 1">查看</el-button>
            <el-button v-if="scope.row.taskStatus==1" type="text" size="medium" @click="handleUpdateStatus(scope.row, 2)" :disabled="isDisabled(scope.row)">禁用</el-button>
            <el-button v-if="scope.row.taskStatus==2" type="text" size="medium" @click="handleUpdateStatus(scope.row, 1)" :disabled="isDisabled(scope.row)">启用</el-button>
          </template>
        </el-table-column>
      </el-table>
    </div>
    <!-- 列表分页 -->
    <div class="pagination">
      <el-pagination background @size-change="handleSizeChange" @current-change="handleCurrentChange"
                     :current-page="memberListQuery.currentPage"
                     :page-sizes="[10, 20, 50, 100]" :page-size="memberListQuery.size"
                     layout="total, sizes, prev, pager, next, jumper"
                     :total="total">
      </el-pagination>
    </div>
    <!-- 添加内部微客弹窗 -->
    <el-dialog title="编辑信息" :visible.sync="financeVisible" :close-on-press-escape="true" width="600px">
      <el-form :model="member" label-width="130px" :rules="rules" ref="form" class="pad-t-10" style="padding-right: 150px">
        <el-form-item label="真实姓名：" prop="realName">
          <el-input v-model="member.realName" placeholder="请输入" :disabled="memberBoolean"></el-input>
        </el-form-item>
        <el-form-item label="性别：" prop="gender">
          <el-radio v-model="member.gender" label="1" :disabled="memberBoolean">男</el-radio>
          <el-radio v-model="member.gender" label="2" :disabled="memberBoolean">女</el-radio>
        </el-form-item>
        <el-form-item label="手机号：" prop="phone">
          <el-input v-model="member.phone" placeholder="请输入" :disabled="memberBoolean"></el-input>
        </el-form-item>
        <el-form-item label="身份证号：" prop="cardNo">
          <el-input v-model="member.cardNo" placeholder="请输入" :disabled="memberBoolean"></el-input>
        </el-form-item>
        <el-form-item label="身份证照：">
          <div class="flex long-input">
            <el-upload action="/api/common/uploadFiles"
                       :disabled="memberBoolean"
                       accept="image/jpeg,image/gif,image/png,image/bmp"
                       list-type="picture-card-auto"
                       :before-upload="beforeUploadJust" name="files"
                       :data="token" :show-file-list="false"
                       v-loading="fileLoading"
                       :on-success="handleUploadSuccessJust">
              <img v-if="member.cardPositiveUrl" :src="member.cardPositiveUrl" width="148px" height="148px">
              <i v-else class="el-icon-plus">正面</i>
            </el-upload>
            <el-upload action="/api/common/uploadFiles"
                       :disabled="memberBoolean"
                       accept="image/jpeg,image/gif,image/png,image/bmp"
                       list-type="picture-card-auto"
                       :before-upload="beforeUpload" name="files"
                       :data="token" :show-file-list="false"
                       v-loading="fileLoading"
                       :on-success="handleUploadSuccess">
              <img v-if="member.cardReverseUrl" :src="member.cardReverseUrl" width="148px" height="148px">
              <i v-else class="el-icon-plus">反面</i>
            </el-upload>
          </div>
        </el-form-item>
        <el-form-item label="银行卡类型：" prop="bankId">
          <el-select v-model="member.bankId" placeholder="请选择" :disabled="memberBoolean">
            <el-option
              v-for="item in banks"
              :key="item.bankId"
              :label="item.bankName"
              :value="item.bankId">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="银行卡号：" prop="bankCardNo">
          <el-input v-model="member.bankCardNo" placeholder="请输入" :disabled="memberBoolean"></el-input>
        </el-form-item>
        <el-form-item label="禁用状态：" prop="taskStatus">
          <el-radio v-model="member.taskStatus" label="1">正常</el-radio>
          <el-radio v-model="member.taskStatus" label="2">拉入小黑屋</el-radio>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="financeVisible = false">关闭</el-button>
        <el-button @click="submit">保存</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<style scoped>
  .user-avatar{
    width: 46px;
    height: 46px;
    display: block;
    border-radius: 50px;
  }
</style>

<script>
  import { getNameByPath } from '@/utils/get-name-by-path' // 不要删除，根据URL获取文件名
  import { pagingMyMember, enableDisable, bacthUpdate, saveMyMember } from '@/api/user/member'
  import { updateDistributionType, getEnterprise, resetSignCode } from '@/api/user/enterprise'
  import { downloadFile } from '@/api/common/common'
  import { listBank } from '@/api/common/common'
  import elDragDialog from '@/directive/el-dragDialog' // base on element-ui
  import store from '@/store'
  import Detail from '../../../components/Member/Detail'
  import { getToken } from '@/utils/auth'
  import Clipboard from 'clipboard'

  export default {
    name: getNameByPath(),
    components: {
      Detail
    },
    directives: {
      // 拖动窗口
      elDragDialog
    },
    data() {
      return {
        memberList: [],
        starEndTime: [],
        th_memberList: [],
        authFlagList: [],
        natureList: [],
        banks: [],
        bankObj: {},
        signCode: '',
        authFlagType: '',
        activeName: '0',
        activeStatus: '1',
        total: null,
        token: null,
        distributionType: '',
        listLoading: true,
        financeVisible: false,
        fileLoading: false,
        memberBoolean: false,
        keyword: '',
        keywordTypeOld: '',
        multipleSelection: [],
        memberListQuery: {
          currentPage: 1,
          size: 10,
          startDate: null,
          endDate: null,
          taskStatus: '1',
          signStatusFlag: '',
          nature: '1',
          keyword: '',
          gender: '',
          bankId: '',
          enterpriseId: this.getEnterpriseId()
        },
        member: {
          taskStatus: '1',
          gender: '1',
          enterpriseId: this.getEnterpriseId()
        },
        memberRemark: {
          memberRemarkId: '',
          remarkType: 1,
          userId: this.getEnterpriseId()
        },
        enterpriseWxaCode: '',
        rules: {
          realName: [
            { required: true, message: '请填写真实姓名', trigger: 'blur' }
          ],
          cardNo: [
            { required: true, message: '请填写身份证', trigger: 'blur' },
            { pattern: /^[1-9]\d{7}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}$|^[1-9]\d{5}[1-9]\d{3}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}([0-9]|X)$/, message: '请输入正确的身份证号' }
          ],
          bankId: [
            { required: true, message: '请填选择银行卡类型', trigger: 'blur' }
          ],
          bankCardNo: [
            { required: true, message: '请填输入银行卡号', trigger: 'blur' },
            { pattern: /^[0-9]*$/, message: '请输入正确的银行卡号' }
          ],
          phone: [
            { required: true, message: '请填写手机号', trigger: 'blur' },
            { pattern: /^1[0123456789]\d{9}$/, message: '请输入正确的手机号' }
          ]
        },
        natureStyleMap: {
          0: 'font-yellow',
          1: 'font-blue',
          2: 'font-green'
        },
        authFlagStyleMap: {
          0: 'font-orange',
          1: 'font-green'
        },
        genders: [{
          value: '',
          label: '性别'
        }, {
          value: '1',
          label: '男'
        }, {
          value: '2',
          label: '女'
        }],
        signStatusFlags: [{
          value: '',
          label: '签约状态'
        }, {
          value: '0',
          label: '未签约'
        }, {
          value: '1',
          label: '已签约'
        }]
      }
    },
    // 过滤器
    filters: {
      statusFilter(status) {
        const statusMap = {
          1: 'success',
          2: 'danger'
        }
        return statusMap[status]
      }
    },
    // 初始化页面
    created() {
      this.initEnterprise()
      this.initBank()
      this.token = {
        accessToken: getToken(),
        enterpriseId: this.getEnterpriseId()
      }
    },
    methods: {
      doCopy() {
        const that = this
        const clipboard = new Clipboard('.copy-bar')
        clipboard.on('success', e => {
          that.$message({ type: 'success', message: '信息复制成功！' })
          clipboard.destroy() // 使用destroy可以清楚缓存
        })
        clipboard.on('error', e => {
          that.$message({ type: 'error', message: '信息复制失败！' })
          clipboard.destroy()
        })
      },
      initMemberList() {
        this.memberListQuery.startDate = null
        this.memberListQuery.endDate = null
        this.listLoading = true
        this.memberListQuery.taskStatus = this.activeStatus
        this.memberListQuery.enterpriseId = this.getEnterpriseId()
        if (this.starEndTime) {
          if (this.starEndTime.length > 0) {
            this.memberListQuery.startDate = this.starEndTime[0]
            this.memberListQuery.endDate = this.starEndTime[1]
          }
        }
        pagingMyMember(this.memberListQuery).then(response => {
          if (response.isError) return
          this.memberList = response.data.records
          if (this.memberList) {
            for (let i = 0; i < this.memberList.length; i++) {
              this.memberList[i].userInfo = {}
              this.memberList[i].userInfo.avatar = this.memberList[i].avatar
              this.memberList[i].userInfo.nickname = this.memberList[i].nickname
              this.memberList[i].userInfo.realName = this.memberList[i].realName
              this.memberList[i].natureStyle = this.natureStyleMap[this.memberList[i].nature]
              this.memberList[i].authFlagStyle = this.authFlagStyleMap[this.memberList[i].authFlag]
            }
          }
          if (this.memberList != null && this.memberList.length > 0) {
            if (response.data.dict.authFlag != null) {
              this.authFlagList = response.data.dict.authFlag
              this.authFlagList[''] = '实名状态'
            }
            if (response.data.dict.nature != null) {
              this.natureList = response.data.dict.nature
            }
          }
          this.total = response.data.total
          this.listLoading = false
        })
      },
      initBank() {
        listBank().then(response => {
          if (response.isError) return
          response.data.forEach(item => {
            this.bankObj[item.bankId] = item.bankName
          })
          this.banks = response.data
          this.initMemberList()
        })
      },
      // 列表排序
      sortChange(data) {
        const { prop, order } = data
        if (prop === 'createTime') {
          if (order === 'ascending') {
            this.memberListQuery.ascs = 'createTime'
            this.memberListQuery.descs = ''
          } else {
            this.memberListQuery.ascs = ''
            this.memberListQuery.descs = 'createTime'
          }
        }
        this.initMemberList()
      },
      handleClick() {
      },
      handleClickStatus() {
        this.initMemberList()
      },
      handleSearch() {
        this.memberListQuery.currentPage = 1
        this.initMemberList()
      },
      // 重置签约编码
      resetSignCode() {
        resetSignCode(this.getEnterpriseId()).then(response => {
          if (response.isError) return
          this.initEnterprise()
        })
      },
      searchReset() {
        this.memberListQuery = {
          currentPage: 1,
          size: 10,
          startDate: null,
          endDate: null,
          taskStatus: '1',
          signStatusFlag: '',
          nature: '1',
          keyword: '',
          gender: '',
          bankId: '',
          enterpriseId: this.getEnterpriseId()
        }
        this.starEndTime = []
        this.initMemberList()
      },
      handleSizeChange(val) {
        this.memberListQuery.size = val
        this.initMemberList()
      },
      handleCurrentChange(val) {
        this.memberListQuery.currentPage = val
        this.initMemberList()
      },
      handleSelectionChange(val) {
        this.multipleSelection = val
        this.th_memberList = []
      },
      // 新增微客
      handleCreate() {
        this.member = {
          taskStatus: '1',
          gender: '1',
          enterpriseId: this.getEnterpriseId()
        }
        this.financeVisible = true
        this.memberBoolean = false
      },
      // 模板下载
      initTemplateDownload() {
        downloadFile('https://enterpriseimg.joinsun.vip/upload/member_import_template.xlsx', {}, '微客导入表格')
      },
      // 详情
      handleUpdate(row) {
        this.memberBoolean = false
        const member = Object.assign({}, row)
        this.member = member
        if (member.gender) {
          this.member.gender = member.gender.toString()
        }
        this.member.taskStatus = member.taskStatus.toString()
        this.financeVisible = true
        if (this.member.signStatusFlag === 1) {
          this.memberBoolean = true
        }
      },
      submit() {
        this.$refs['form'].validate((valid) => {
          if (valid) {
            saveMyMember(this.member).then(response => {
              if (response.isError) return
              this.financeVisible = false
              this.initMemberList()
            })
          }
        })
      },
      beforeUpload(file) {
        const isJPG = file.type === 'image/jpeg'
        const isGIF = file.type === 'image/gif'
        const isPNG = file.type === 'image/png'
        const isBMP = file.type === 'image/bmp'

        if (!isJPG && !isGIF && !isPNG && !isBMP) {
          this.$message.error('上传图片必须是JPG/GIF/PNG/BMP 格式!')
        }
        this.fileLoading = true
        return (isJPG || isBMP || isGIF || isPNG)
      },
      handleUploadSuccess(res, file) {
        this.fileLoading = false
        if (res.code === 101) {
          this.member.cardReverseUrl = res.data[0]
        } else {
          this.$message({
            type: 'error',
            message: res.msg
          })
          return false
        }
      },
      beforeUploadFile(file) {
        this.fileLoading = true
      },
      handleUploadSuccessFile(res, file) {
        this.fileLoading = false
        if (res.code === 101) {
          this.$router.push({ path: '/member/my-member/my-member-char/index', query: { entity: res.data }})
        } else {
          this.$message({
            type: 'error',
            message: res.msg
          })
          return false
        }
      },
      beforeUploadJust(file) {
        const isJPG = file.type === 'image/jpeg'
        const isGIF = file.type === 'image/gif'
        const isPNG = file.type === 'image/png'
        const isBMP = file.type === 'image/bmp'

        if (!isJPG && !isGIF && !isPNG && !isBMP) {
          this.$message.error('上传图片必须是JPG/GIF/PNG/BMP 格式!')
        }
        this.fileLoading = true
        return (isJPG || isBMP || isGIF || isPNG)
      },
      handleUploadSuccessJust(res, file) {
        this.fileLoading = false
        if (res.code === 101) {
          this.member.cardPositiveUrl = res.data[0]
        } else {
          this.$message({
            type: 'error',
            message: res.msg
          })
          return false
        }
      },
      initEnterprise() {
        getEnterprise(this.getEnterpriseId()).then(response => {
          if (response.isError) return
          this.signCode = response.data.signCode
        })
      },
      saveDistributionType() {
        let type = 0
        if (this.distributionType === true) {
          type = 1
        }
        updateDistributionType(this.getEnterpriseId(), type).then(response => {
          if (response.isError) return
        })
      },
      // 更新
      handleUpdateStatus(row, status) {
        this.reashMember()
        this.member = row
        this.member.taskStatus = status
        let name = ''
        if (status === 2) {
          name = '禁用成功!'
        } else {
          name = '启用成功!'
        }
        enableDisable(this.member).then((respont) => {
          this.$message({
            type: 'success',
            message: name
          })
          this.initMemberList()
        })
      },
      isDisabled(row) {
        // 不能锁定、删除自己
        return row.username === store.getters.username
      },
      // 重置member
      reashMember() {
        this.member = {
          memberId: '',
          nickname: '',
          realName: '',
          nature: '',
          memberGrade: '',
          labelName: '',
          phone: '',
          taskRegisteredTime: '',
          authFlag: '',
          taskStatus: '',
          delFlag: ''
        }
      },
      // 批量操作
      bacthOperation(query) {
        if (this.multipleSelection.length > 0) {
          this.multipleSelection.forEach((item) => {
            this.reashMember()
            this.member.memberId = item.memberId
            if (query === '') {
              this.member.delFlag = 1
            } else {
              this.member.taskStatus = query
            }
            this.th_memberList.push(this.member)
          })
          bacthUpdate(this.th_memberList).then((respont) => {
            this.initMemberList()
            this.$message({
              type: 'success',
              message: '操作成功!'
            })
          })
          this.th_memberList = []
        } else {
          this.$message({
            type: 'success',
            message: '请选择要操作的数据!'
          })
        }
      }
    },
    mounted() {

    }
  }
</script>
